/**
 * Descriptions：
 * <p>
 * Author：ChenME
 * Date：2017/6/26
 * Email：ibelieve1210@163.com
 */
import React, {Component} from 'react';
import {
    StyleSheet,
    Text,
    View,
    Image,
    TouchableOpacity,
    Platform,
    ScrollView,
} from 'react-native';

import {StackNavigator,} from 'react-navigation';

import {CommonCellMore} from '../common/CMECommCellMore';

class CMEMore extends Component {

    static navigationOptions = {
        // title: '更多',
        // style: {
        //     backgroundColor: '#ff639b'
        // },
        header: ()=> {
            return (
                <View style={styles.navBar}>
                    <View style={styles.navBarContent}>

                        {/*标题*/}
                        <Text style={styles.navBarTitle}>更多</Text>

                        {/*右边*/}
                        <TouchableOpacity>
                            <Image
                                source={{uri: 'icon_mine_setting'}}
                                style={styles.navBarRightImage}
                            />
                        </TouchableOpacity>

                    </View>
                </View>
            );
        },
    };

    render() {
        return (
            <ScrollView >
                <View style={styles.itemArea}>
                    <CommonCellMore
                        title="扫一扫"/>
                </View>

                <View style={styles.itemArea}>
                    <CommonCellMore
                        title="省流量模式"
                        isShowSwitch={true}/>
                    <CommonCellMore
                        title="消息提醒"/>
                    <CommonCellMore
                        title="邀请好友使用码团"/>
                    <CommonCellMore
                        title="清空缓存"
                        rightText="123M"/>
                </View>

                <View style={styles.itemArea}>
                    <CommonCellMore
                        title="问卷调查"/>
                    <CommonCellMore
                        title="支付帮助"/>
                    <CommonCellMore
                        title="网络诊断"/>
                    <CommonCellMore
                        title="关于码团"/>
                    <CommonCellMore
                        title="我要应聘"/>
                </View>

                <View style={styles.itemArea}>
                    <CommonCellMore
                        title="精品应用"/>
                </View>
            </ScrollView>
        );
    }
}

const MorePage = StackNavigator({
    CMEMore: {
        screen: CMEMore,
    },
}, {
    headerMode: 'screen'
});

const styles = StyleSheet.create({

    navBar: {//导航条整体样式
        height: Platform.OS === 'ios' ? 71 : 49,
        backgroundColor: '#ff639b',
        elevation: 5,
        borderBottomWidth: 1,
        borderBottomColor: '#ddd',
    },

    navBarContent: {//导航条内容样式
        height: 49,
        flexDirection: 'row',
        marginTop: Platform.OS === 'ios' ? 22 : 0,
        alignItems: 'center',
    },

    navBarTitle: {
        fontSize: 18,
        flex: 1,
        marginLeft: 35,
        textAlign: 'center',
        fontWeight: 'bold',
        color: '#fff'
    },

    navBarRightImage: {//导航条图片样式
        marginHorizontal: 10,
        width: 25,
        height: 25,
    },

    itemArea: {
        marginTop: 20,
    },
    // buttonGray: {
    //     borderWidth: 1,
    //     marginTop: 10,
    //     alignSelf: 'center',
    //     paddingHorizontal: 3,
    //     paddingVertical: 5,
    //     borderRadius: 4,
    //     color: '#333',
    //     backgroundColor: '#fff',
    // },
});

export {MorePage};